const template = `
	<div class="patrol">
		<van-nav-bar
			:title="title"
			@click-left="onBack"
			left-arrow
		/>
		<div class="patrol__inner">
			<div>
				<p style="padding-left: 60px;">{{ dateStr || '您还未开始巡检' }}</p>
			</div>
			<h4 style="text-align: center;">请选择巡检班次</h4>
			<van-divider />
			<div style="padding: 15px;">
				<ul class="patrol-grade">
					<li v-for="(item,index) in list" :key="index" class="patrol-grade__item" :class="{finished: item.finished}">
						<a @click="onSelectPatrol(item.text,item.id)">
							{{ item.text }}
						</a>
					</li>
				</ul>
			</div>
			<van-divider />
			<van-button type="info" :disabled="!selectedPatrolId" style="width: 80%;left: 10%;" round size="large" @click="confirmPatrol">确认班次</van-button>
		</div>
	</div>
`;

export default {
	created() {
		axios.get('/tPatrolRoutes/listTime').then(resp => {
			if(resp.status === 200) {
				this.list = resp.data.reduce((accu,v)=> {
					accu.push({
						id: v.id,
						text: v.timePeriod,
						finished: v.stateThisDay === '1', // 0未巡检，1已巡检
					});
					return accu;
				}, []);
			}
		});
	},
	
	data() {
		return {
			title: '三山水厂自控平台',
			dateStr: '',
			selectedPatrol: '',
			selectedPatrolId: '',
			list: []
		}
	},
	methods: {
		onSelectPatrol(patrol, id) {
			if(this.list.filter(v => v.id === id)[0].finished) {
				// 巡检任务已被领取
				return;
			}
			
			this.selectedPatrol = patrol;
			this.selectedPatrolId = id;
			this.dateStr = patrol;
		},
		
		confirmPatrol() {
			if(!this.selectedPatrolId) {
				this.$toast('还未选择巡检班次');
				return;
			}
			
			this.$toast({
				message: '正在生成任务...',
				duration: 0,
				overlay: true,
			});
			
			setTimeout(() => {
				this.$toast.clear()
			}, 5000)
			
			return;
			
			axios.post('/patrolRecordMs/saveTask/' + this.selectedPatrolId).then(resp => {
				if(resp.status === 200) {
					this.$router.push('/main/patrolList/' + resp.data.id);
				}
			})
				
		},
		
		onBack() {
			this.$router.go(-1)
		},
	},
	
	template,
	
	components: {
		
	}
}